import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import "./mock"
import "element-plus/theme-chalk/index.css";
import Vue3ColorPicker from "vue3-colorpicker";
import "vue3-colorpicker/style.css";
import * as ElementPlusIconsVue from "@element-plus/icons-vue";
import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/reset.css';
//解决控制台 touchstart 事件警告
// import '@/assets/styles/globals.scss'
// import 'default-passive-events'
const app = createApp(App);
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component);
}
app.use(Antd);
app.use(router);
app.use(Vue3ColorPicker);
app.mount("#app");
//以下代码是为了解决ResizeObserver loop completed with undelivered notifications.问题
const debounce = (fn, delay) => {
  let timer = null;
  return function () {
    let context = this;
    let args = arguments;
    clearTimeout(timer);
    timer = setTimeout(function () {
      fn.apply(context, args);
    }, delay);
  };
};

const _ResizeObserver = window.ResizeObserver;
window.ResizeObserver = class ResizeObserver extends _ResizeObserver {
  constructor(callback) {
    callback = debounce(callback, 16);
    super(callback);
  }
};
// 1.我们先自己构造一些假数据 能实现根据位置渲染内容
// 2.配置组件对应的映射关系  {preview:xxx,render:xxx}
